import { useCallback, useEffect, useState } from 'react'

import * as images from './assets'

export default function usePreload() {
  const [loadedNum, setLoadedNum] = useState(0)
  const preload = useCallback(() => {
    Object.keys(images).forEach((key) => {
      const img = new Image()
      img.onload = () => {
        setLoadedNum((prev) => prev + 1)
      }
      img.src = images[key as keyof typeof images]
    })
  }, [])

  useEffect(() => {
    preload()
  }, [preload])

  return loadedNum >= Object.keys(images).length
}
